<template>
  <basic-container class="groupAnalysis">
    <div style="padding: 10px; text-align: right">
      <el-button type="primary" @click="handleDown">导出分析报告</el-button>
    </div>
    <div id="groupAnalysisExport" style="width: 100%" v-if="loading">
      <div class="cover-div">
        <img class="cover" src="./img/团体报告封面JPG.jpg" alt="" />
        <div class="cover-title">{{ demographicData.schoolName }}</div>
        <div class="cover-date">{{ date }}</div>
      </div>
      <div class="content">
        <h3 class="textCenter">
          <!-- {{ demographicData.schoolName + demographicData.projectName }}研究报告 -->
          {{ demographicData.schoolName }}
        </h3>
        <h4 class="textCenter">心理健康发展报告</h4>
        <h3 class="textCenter">
          <span
            v-for="(item, count) in demographicData.gradeList"
            :key="count + new Date()"
          >
            <span>{{ item.name }}</span> </span
          >（{{ new Date(demographicData.createAt).getFullYear() }} 学年）
        </h3>
        <div class="explain" style="margin-bottom: 10px">
          小学高年级和中学生正处在身心迅速发展的时期，他们所面临的内在压力和外在压力普遍增多。适当的压力可以提高个体的动机，促进学习和工作的效率，使个体适应得更好。但当前，不少压力已远远超过了他们所能负荷的程度，常常会引起纷扰，不利的、危机重重的后果。这些不良后果可能包括身体的症状，焦虑、紧张、不安、恐惧、抑郁等情绪困扰，以及种种适应问题，甚至引发精神症状等。为了正确诊断中小学生的情绪困扰和适应不良，我国心理测量专家对日本铃木清等人编制的“不安倾向诊断测验”进行了修订，并制订出中国的常模，成为适用于我国中小学生标准化的《心理健康诊断测验》。
        </div>
        <table border="1" class="table_style">
          <tbody>
            <tr>
              <td>教育局负责人</td>
              <td>{{ educationInfo.linkman }}</td>
              <!-- <td>王文清**</td> -->
            </tr>
            <tr>
              <td>督查</td>
              <td>{{ educationInfo.linkmanTwo }}</td>
              <!-- <td>康领导</td> -->
            </tr>
            <tr>
              <td>落实校长</td>
              <td>{{ tenantInfo.linkman }}</td>
              <!-- <td>黄永善</td> -->
              <!-- <td>李**</td> -->
            </tr>
            <tr>
              <td>学校名称</td>
              <td>{{ demographicData.schoolName }}</td>
            </tr>
            <tr>
              <td>数据采集时间</td>
              <td>{{ demographicData.createAt }}</td>
            </tr>
            <tr>
              <td>参加学生人数</td>
              <td>{{ sampleTotal }}</td>
            </tr>
          </tbody>
        </table>
        <br />
        <div
          style="
            background: burlywood;
            margin-top: 10px;
            margin-bottom: 10px;
            font-size: 20px;
            padding: 14px;
            color: white;
            text-align: center;
          "
        >
          心理健康
        </div>

        <br />
        <div>
          <h3>{{ demographicData.totalScoreMap[key].title }}</h3>
          <h3>测试目标：</h3>
          <div class="explain">
            人的健康包括身体健康、心理健康和良好的社会适应。小学高年级和中学生正处在身心迅速发展的时期，他们所面临的内外压力普遍增多。适度的压力可以提高个体的动机，促进学习和工作的效率，使个体适应的更好。但当前，不少压力已超过了他们所负荷的程度，常常会引发过强的焦虑，紧张、不安、抑郁、恐怖、孤独、自责、过敏、冲动，身体症状等心理困扰和适应问题，甚至引发精神症状。
            通过本测验，就是帮助老师、家长和学生本人了解存在的问题，然后有的放矢的从认知和行为等层面上进行辅导，以改善、维护和提高心理健康水平。
          </div>
          <h3>量表适用：</h3>
          <div class="explain">
            本测试的适用范围为中小学生，测试结果仅作参考作用。
          </div>
          <h3>测验说明：</h3>
          <div class="explain">{{ demographicData.remark }}</div>
          <h3>调查工具：</h3>
          <div class="explain">
            采用华东师范大学周步成等修订的《心理健康诊断测验》(MHT)，该测验适用于综合检测中学生的心理健康状况。MHT共有100个题项，包括8个内容量表和一个效度量表(即测谎量表)，该测验覆盖面广，筛选率高，具有较高的信度和效度。8个内容量表分别是：学习焦虑、对人焦虑、孤独倾向、自责倾向、过敏倾向、身体症状、恐怖倾向、冲动倾向。每个题项后有“是”和“否”两个答案，要求被试根据自己的真实情况进行选择。8个内容量表得分累积起来，就是总得分。分量表从整体上表示焦虑程度强不强、焦虑范围广不广;而总得分则表示个人焦虑的一般倾向。该测验以整个量表在65分以上，各内容量表上超过8分作为指标来考察其心理健康状况。如果一个学生的总分超过了65分，说明该生的总焦虑水平较高，范围较广，有情绪困扰和行为问题。8个内容量表中，任何一项标准分达到8分以上时，表明该生在此方面的心理健康问题已到需有针对性关注的程度。
          </div>
          <h3>调查方法：</h3>
          <div class="explain">
            本调查以班级为单位、由班主任配合给予统一指导：
          </div>
          <div class="explain">
            测验的场所：本测验属于团体测验（也可个别实施）。不要在太吵闹或学生容易分心的地方。
          </div>
          <div class="explain">
            测验的时间：选择一个合适的测验时刻，整个测验约需40-50分钟，测验时间不必严格限制。
          </div>
          <h3>整体情况：</h3>
          <div class="explain">
            本次参与测评共计{{ demographicData.person }}人， 男生{{ boy }}人
            ,女生{{ girl }}人。 实际发放问卷{{ demographicData.person }}份，
            <span v-for="itemzz in factorData" :key="itemzz.factorName">
              <span v-if="itemzz.factorName == '效度量表'">
                收回{{
                  itemzz.list[0].value + itemzz.list[1].value
                }}份，回收率为
                {{
                  parseFloat(
                    (
                      ((itemzz.list[0].value + itemzz.list[1].value) / count) *
                      100
                    ).toFixed(2)
                  )
                }}%; 剔除{{
                  itemzz.list[1].value
                }}份效度量表得分高于7分的问卷，实得有效问卷{{
                  itemzz.list[0].value
                }}， 有效回收率为{{
                  parseFloat(((itemzz.list[0].value / count) * 100).toFixed(2))
                }}%。
              </span>
            </span>
            <!-- 综合评估情况为：正常{{ seriesData[0].value }}人，占比{{
              count
                ? parseFloat(((seriesData[0].value / count) * 100).toFixed(2))
                : 0
            }}%；需要关注{{ seriesData[4].value }}人，占比{{
              count
                ? parseFloat(((seriesData[4].value / count) * 100).toFixed(2))
                : 0
            }}%；重点预警{{ seriesData[5].value }}人；占比{{
              count
                ? parseFloat(((seriesData[5].value / count) * 100).toFixed(2))
                : 0
            }}%；一级预警：{{ seriesData[1].value }}人，占比{{
              count
                ? parseFloat(((seriesData[1].value / count) * 100).toFixed(2))
                : 0
            }}%；二级预警：{{ seriesData[2].value }}人，占比{{
              count
                ? parseFloat(((seriesData[2].value / count) * 100).toFixed(2))
                : 0
            }}%；三级预警：{{ seriesData[3].value }}人，占比{{
              count
                ? parseFloat(((seriesData[3].value / count) * 100).toFixed(2))
                : 0
            }}%； -->
            具体结果如下图所示：
          </div>
          <div style="margin: 10px 0">
            <table border="1" class="table_style">
              <tbody>
                <tr>
                  <td>正常</td>
                  <td>
                    {{ seriesData[0].value }}人，占比{{
                      parseFloat(
                        ((seriesData[0].value / count) * 100).toFixed(2)
                      )
                    }}%
                  </td>
                  <td>需要关注</td>
                  <td>
                    {{ seriesData[5].value }}人，占比{{
                      count
                        ? parseFloat(
                            ((seriesData[5].value / count) * 100).toFixed(2)
                          )
                        : 0
                    }}%
                  </td>
                </tr>
                <tr>
                  <td>重点预警</td>
                  <td>
                    {{ seriesData[4].value }}人；占比{{
                      count
                        ? parseFloat(
                            ((seriesData[4].value / count) * 100).toFixed(2)
                          )
                        : 0
                    }}%
                  </td>
                  <td>一级预警</td>
                  <td>
                    {{ seriesData[1].value }}人，占比{{
                      count
                        ? parseFloat(
                            ((seriesData[1].value / count) * 100).toFixed(2)
                          )
                        : 0
                    }}%
                  </td>
                </tr>
                <tr>
                  <td>二级预警</td>
                  <td>
                    {{ seriesData[2].value }}人，占比{{
                      count
                        ? parseFloat(
                            ((seriesData[2].value / count) * 100).toFixed(2)
                          )
                        : 0
                    }}%
                  </td>
                  <td>三级预警</td>
                  <td>
                    {{ seriesData[3].value }}人，占比{{
                      count
                        ? parseFloat(
                            ((seriesData[3].value / count) * 100).toFixed(2)
                          )
                        : 0
                    }}%
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
          <div class="echarts1" id="heartWarningPie"></div>
          <div v-for="(item, index) in factorData" :key="item.factorName">
            <h4>{{ item.factorName }}</h4>
            <div class="explain">{{ item.suggest }}</div>
            <div v-if="item.factorName != '效度量表'">
              <div class="explain">
                本次调查结果如下图所示：
                <!-- 正常{{ item.list[0].value }}人，占比{{
                  item.num
                    ? parseFloat(
                        ((item.list[0].value / item.num) * 100).toFixed(2)
                      )
                    : 0
                }}% 需要关注：{{ item.list[1].value }}人，占比{{
                  item.num
                    ? parseFloat(
                        ((item.list[1].value / item.num) * 100).toFixed(2)
                      )
                    : 0
                }}%； -->
              </div>
              <div style="margin: 10px 0">
                <table border="1" class="table_style">
                  <tbody>
                    <tr>
                      <td>测评结果</td>
                      <td>正常</td>
                      <td>需要关注</td>
                    </tr>
                    <tr>
                      <td>人数</td>
                      <td>{{ item.list[0].value }}</td>
                      <td>{{ item.list[1].value }}</td>
                    </tr>
                    <tr>
                      <td>占比</td>
                      <td>
                        {{
                          item.num
                            ? parseFloat(
                                ((item.list[0].value / item.num) * 100).toFixed(
                                  2
                                )
                              )
                            : 0
                        }}%
                      </td>
                      <td>
                        {{
                          item.num
                            ? parseFloat(
                                ((item.list[1].value / item.num) * 100).toFixed(
                                  2
                                )
                              )
                            : 0
                        }}%
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>
            <div v-else>
              <div class="explain">
                本次调查结果如下图所示：有效问卷{{
                  item.list[0].value
                }}份，占比{{
                  item.num
                    ? parseFloat(
                        ((item.list[0].value / item.num) * 100).toFixed(2)
                      )
                    : 0
                }}% 无效问卷：{{ item.list[1].value }}份，占比{{
                  item.num
                    ? parseFloat(
                        ((item.list[1].value / item.num) * 100).toFixed(2)
                      )
                    : 0
                }}%；
              </div>
              <div style="margin: 10px 0">
                <table border="1" class="table_style">
                  <tbody>
                    <tr>
                      <td>测评结果</td>
                      <td>有效问卷</td>
                      <td>无效问卷</td>
                    </tr>
                    <tr>
                      <td>人数</td>
                      <td>{{ item.list[0].value }}</td>
                      <td>{{ item.list[1].value }}</td>
                    </tr>
                    <tr>
                      <td>占比</td>
                      <td>
                        {{
                          item.num
                            ? parseFloat(
                                ((item.list[0].value / item.num) * 100).toFixed(
                                  2
                                )
                              )
                            : 0
                        }}%
                      </td>
                      <td>
                        {{
                          item.num
                            ? parseFloat(
                                ((item.list[1].value / item.num) * 100).toFixed(
                                  2
                                )
                              )
                            : 0
                        }}%
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>

            <div :id="'factor' + index" class="factor"></div>
          </div>
          <h3>{{ demographicData.schoolName }}总体心理健康状况分析：</h3>
          <div class="explain">
            调查显示，目前{{
              demographicData.schoolName
            }}
            学生心理健康总体状况：有{{
              count
                ? parseFloat(((seriesData[0].value / count) * 100).toFixed(2))
                : 0
            }}%的学生正常， 在被调查的学生中有{{
              count
                ? parseFloat(((seriesData[4].value / count) * 100).toFixed(2))
                : 0
            }}%的学生需要关注， 而有{{
              count
                ? parseFloat(((seriesData[5].value / count) * 100).toFixed(2))
                : 0
            }}%的学生心理健康预警，由此可见{{
              demographicData.schoolName
            }}学生，处于心理健康水平“需要关注”的学生，当前可能存在一些心理问题或心理困扰，需要学校对他们进行进一步的心理辅导和心理健康教育。此外，对于处于心理“预警”的学生，其心理健康水平可能较低，甚至存在一定的心理疾病或心理障碍，需要立即对其进行面谈，了解其情绪状态，进而及时采取相应的预防措施。
            若Ta们的心理问题得不到及时解决，就可能会产生心理障碍或心理疾病
            ，此部分学生的心理问题不容忽视。
          </div>
          <h3>总结：</h3>
          <div class="explain">
            一、中学生心理健康教育是避免各种突发事件，维护社会安定团结、学校正常运作、学生家庭幸福的必要条件。注重学生的心理健康教育工作，及时的识别并疏导，使陷于不平衡或者不适应的个体恢复到正常水平，可以大大减少校园及社会不稳定因素，减少青少年异常行为，是维护家庭、校园、社会安定的重要环节。
          </div>
          <div class="explain">
            二、注重中学生心理健康教育，是保证学生健康正常成长的需要。注重中学生的心理健康教育，可以促进学生学业稳定，促进学生形成良好的品质，保证学生健康顺利地成长与发展。
          </div>
          <div class="explain">
            三、注重中学生心理健康教育，是青少年身心发展的特点的需要。青少年时期是人生道路上一个非常特别、又很重要的阶段，每个人的很多人格特点都是在这一年龄阶段形成，这个年纪的孩子，不仅面临生理上的发育和变化，也经历着一系列心理的变化。此时的引导，对于他们形成健康的认知，发展出完善的人格，维持稳定的情绪都具有很重要的意义。
          </div>
          <div class="explain">
            四、这也是教育的根本宗旨和意义。教育的目的是让每个人更好地发展，并成为自己。成绩对于每个学生固然很重要，但是拥有一个健康的心态和成熟的心理，对于学生今后毕业、走入社会，乃至完成人生的目标和期许，多大程度上成为一个有用的、或者幸福的人，都具有深远的影响。一个人的人生是由很多因素合力推动的，我们在现实生活中也常常会遇到那些成绩很好，但是适应不良的学生，他们很多后来会在人生的某个阶段出现不同程度的问题。所以，心理健康问题，不仅仅是对个人，甚至是对整个家庭、整个社会一代代传承影响的重要因素。
          </div>
          <div class="explain">
            学生心理健康成长和发展从根本上来说是一种自觉和主动的过程，引导学生主动参与，切实提高心育实效，不断通过加大宣传力度，让学生科学了解发展性心理健康教育，强化其参与心理健康教育，从而优化自身心理素质，提高自身心理健康水平
          </div>
          <div class="explain">
            心理健康教育工作是长期的、潜移默化的过程。全校教师都承载着一份责任，一份希望。开展心理课、建设心理室、建立每个学生的心理健康档案、制定个体辅导规划.....我们坚持着将每一次进步看做一个新的起点，站在这新的起点，把足迹延向远方，把心弦拨响，积蓄和迸发新的能量，让学生的心灵天空一片蔚蓝。
          </div>
        </div>
      </div>
      <div class="cover-div">
        <img class="cover2" src="./img/团体报告封底JPG.jpg" alt="" />
      </div>
    </div>
    <!-- <div style="text-align: center">
      <el-button type="primary" @click="handleDown">导出分析报告</el-button>
    </div> -->
  </basic-container>
</template>

<script>
import { getTeam, getDictListInfo } from "@/api/census/report";
import { mapGetters } from "vuex";
import { getList } from "@/api/census/grade";
// // import htmlToPdf from "@/util/htmlToPdf";
// import htmlToPdf from "@/util/htmlToPdf";
import htmlToPdf from "@/util/htmlToPdf";
import * as echarts from "echarts";
import axios from "@/router/axios";
import { cloneDeep } from "lodash";
import { getList as getLevelList, getEducationInfo } from "@/api/system/dict";
import dayjs from "dayjs";
import { getTenantInfo } from "@/api/system/tenant";
export default {
  data() {
    return {
      form: {},
      activeNames: ["1"],
      totalScoreMapName: [],
      demographicData: [],
      conclusion: "",
      gradeServiceList: [],
      factorData: [],
      key: "",
      levelType: [
        { name: "正常", value: 0 },
        { name: "一般症状", value: 0 },
        { name: "严重症状", value: 0 },
      ],
      loading: false,
      seriesData: [],
      count: 0,
      boy: 0,
      girl: 0,
      date: "",
      sampleTotal: 0,
      educationInfo: {},
    };
  },
  computed: {
    ...mapGetters(["userInfo", "permission"]),
    permissionList() {
      return {
        addBtn: false,
        viewBtn: false,
        delBtn: true,
        editBtn: false,
      };
    },
  },
  created() {
    this.$loading({
      lock: true,
      text: "Loading",
      spinner: "el-icon-loading",
      background: "rgba(0, 0, 0, 0.7)",
    });
    getList({}).then((res) => {
      this.gradeServiceList = res.data.data;
      getDictListInfo({}).then((result) => {
        this.getReportList(result.data.data[0].children);
      });
    });
    this.date = dayjs(new Date()).format("YYYY年MM月DD日");
    this.sampleTotal = this.$route.query.sampleTotal;
    this.getSupervision();
  },
  methods: {
    getSupervision() {
      let info = JSON.parse(localStorage.getItem("saber-userInfo")).content;

      getEducationInfo(info.tenantId).then((res) => {
        this.educationInfo = res.data.data;
        this.educationInfo.principal = info.userName;
      });

      getTenantInfo(info.tenantId).then((res) => {
        this.tenantInfo = res.data.data;
      });
    },
    getSexInfo() {
      for (let itemzzz in this.demographicData.totalScoreMap) {
        for (let sexItem in this.demographicData.totalScoreMap[itemzzz]
          .sexTotal) {
          let rowData =
            this.demographicData.totalScoreMap[itemzzz].sexTotal[sexItem];
          if (rowData.factorName == "总分" && rowData.other == "1") {
            this.boy += rowData.num;
          }
          if (rowData.factorName == "总分" && rowData.other == "2") {
            this.girl += rowData.num;
          }
        }
      }
    },
    getGradeName(id) {
      for (let zz in this.gradeServiceList) {
        if (this.gradeServiceList[zz].gradeNo == id) {
          return this.gradeServiceList[zz].gradeName;
        }
      }
      return "";
    },
    getReportList(resultData) {
      getTeam(
        Object.assign({
          id: this.$route.query.id,
        })
      ).then(async (res) => {
        this.demographicData = res.data.data;
        this.getSexInfo();
        this.conclusion = this.demographicData.conclusion;
        let key = Object.keys(res.data.data.totalScoreMap);
        this.key = key;
        let factorData = [];
        await axios
          .get(`/api/blade-measure/measure/gaugefactor/list`, {
            params: {
              current: 1,
              size: 20,
              gaugeId: key[0],
            },
          })
          .then((res) => {
            let data = res.data.data.records;
            data.forEach((item) => {
              if (
                item.factorName.indexOf("总分") == -1 &&
                item.factorName.indexOf("总均分") == -1
              ) {
                let factor = {
                  factorName: item.factorName,
                  suggest: item.suggest,
                  list: [],
                  num: 0,
                };

                let normalNum = 0;
                let attentionNum = 0;
                this.demographicData.totalScoreMap[key].total.forEach(
                  (item2) => {
                    if (item.factorName == item2.factorName) {
                      let isExit = false;
                      for (let zz = 0; zz < resultData.length; zz++) {
                        let row = resultData[zz];
                        if (item2.name === "作答真实") {
                          item2.name = "答题真实";
                        }
                        if (row.dictValue == item2.name.trim()) {
                          isExit = true;
                          if (row.remark == "正常") {
                            normalNum += item2.num;
                          } else {
                            attentionNum += item2.num;
                          }
                          factor.num += item2.num;
                        }
                      }
                      if (!isExit) {
                        if (item2.name == "正常") {
                          normalNum += item2.num;
                        } else {
                          attentionNum += item2.num;
                        }
                        factor.num += item2.num;
                      }
                    }
                    if (item.factorName == "效度量表") {
                      factor.list = [
                        { value: normalNum, name: "有效问卷" },
                        { value: attentionNum, name: "无效问卷" },
                      ];
                    } else {
                      factor.list = [
                        { value: normalNum, name: "正常" },
                        { value: attentionNum, name: "需要关注" },
                      ];
                    }
                  }
                );
                factorData.push(factor);
              }
            });
            this.factorData = cloneDeep(factorData);

            this.$nextTick(() => {
              // this.initChartData();
              this.initWarning(factorData);
            });
          });
      });
    },
    handleDown() {
      this.$loading({
        lock: true,
        text: "正在导出报告...",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      htmlToPdf.downloadPDF(
        document.querySelector("#groupAnalysisExport"),
        this.demographicData.schoolName + "团体分析报告",
        this
      );
    },
    compare(property) {
      return function (a, b) {
        var value1 = a[property] * 1;
        var value2 = b[property] * 1;
        return value1 - value2;
      };
    },
    async initWarning(factorData) {
      this.getCount(this.demographicData.projectId, factorData);
    },
    initWholeEcharts(seriesData) {
      var chartDom = document.getElementById("heartWarningPie");
      var myChart = echarts.init(chartDom);
      var option;
      option = {
        legendHoverLink: false,
        grid: {
          height: 180,
        },
        title: {
          text: "整体测评概况",
          textStyle: {
            color: "#0986b3",
            fontSize: 18,
          },
          x: "center",
          y: "bottom",
        },
        tooltip: {
          trigger: "item",
          formatter: "{a}<br />{b}: {c}人(占比：{d}%)",
          textStyle: {
            fontSize: 16,
          },
        },
        legend: {
          orient: "horizontal",
          top: "85%",
          textStyle: {
            // color: "white",
            fontSize: 16,
          },
        },
        color: ["green", "#FF4500", "#FFA07A", "#FFD700", "#224b8f", "#8552a1"],
        series: [
          {
            name: "心理安全预警",
            type: "pie",
            radius: ["40%", "60%"],
            center: ["50%", "45%"],
            data: seriesData,
            labelLine: {
              length: 7,
              length2: 5,
              show: true,
            },
            label: {
              // position: "inside",
              // color: "white",
              formatter: "{d}%",
              textStyle: {
                fontSize: 16,
              },
            },
          },
        ],
      };

      option && myChart.setOption(option);
    },
    initFactorEachrts(seriesData, index) {
      var formatterInfo = "{a}<br />{b}: {c}人(占比：{d}%)";
      let formatter = "{c} 人";
      if (seriesData.factorName == "效度量表") {
        formatterInfo = "{b}: {c}份(占比：{d}%)";
        formatter = "{c} 份";
      }
      var chartDom = document.getElementById("factor" + index);
      var title = seriesData.factorName + "测评情况";
      var myChart = echarts.init(chartDom);
      var option;
      option = {
        legendHoverLink: false,
        grid: {
          height: 260,
        },
        title: {
          text: title,
          textStyle: {
            color: "#0986b3",
            fontSize: 18,
          },
          x: "center",
          y: "bottom",
        },
        tooltip: {
          trigger: "item",
          formatter: formatterInfo,
        },
        legend: {
          orient: "horizontal",
          top: "82%",
          textStyle: {
            color: "#0986b3",
            fontSize: 16,
          },
        },
        color: ["green", "#FFA07A", "#FF4500", "#FFD700", "#224b8f", "#8552a1"],
        series: [
          {
            name: "心理安全预警",
            type: "pie",
            radius: ["40%", "60%"],
            center: ["50%", "45%"],
            data: seriesData.list,
            label: {
              formatter: formatter,
              textStyle: {
                fontSize: 16,
              },
            },
          },
        ],
      };

      option && myChart.setOption(option);
    },
    async getCount(projectId, factorData) {
      let seriesData = [];
      await getLevelList(1, 1000, { code: "warning_level" }).then((res) => {
        res.data.data[0].children.map((vv) => {
          if (vv.dictKey != 0) {
            seriesData.push(vv);
          }
        });
        seriesData.unshift({
          dictKey: 0,
          dictValue: "正常人数",
        });
        seriesData = seriesData.map((item) => {
          let level = {
            code: item.dictKey,
            name: item.dictValue,
            value: 0,
          };
          return level;
        });
        axios
          .get("/api/blade-measure/measure/userprojectgauge/count", {
            params: {
              projectId,
            },
          })
          .then((res) => {
            let data = res.data.data;
            let num = 0;
            seriesData.map((item) => {
              data.map((item2) => {
                if (item.code == item2.level) {
                  item.value = item2.count;
                }
              });
              return item;
            });
            seriesData.forEach((item) => {
              num += item.value;
            });
            this.seriesData = seriesData;
            this.count = num;
            this.loading = true;
            this.$nextTick(() => {
              this.initWholeEcharts(seriesData);
              factorData.forEach((item, index) => {
                this.initFactorEachrts(item, index);
              });
              this.$loading().close();
            });

            // console.log(res.data);
            // console.log(seriesData);
          });
      });
    },
  },
};
</script>

<style lang="scss" scoped>
* {
  font-size: 23px !important;
}
.button {
  font-size: 16px !important;
}
.cover-div {
  position: relative;
  padding: 0 50px 0 60px;

  .cover {
    width: 100%;
    height: 1430px;
  }

  .cover2 {
    width: 100%;
    height: 1430px;
  }

  .cover-title {
    position: absolute;
    left: 280px;
    top: 711px;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    font-size: 40px !important;
    font-weight: bold;
    color: rgb(0, 161, 153);
  }

  .cover-date {
    position: absolute;
    right: 70px;
    bottom: 28px;
    font-size: 30px !important;
    font-weight: bold;
  }
}
.groupAnalysis {
  #groupAnalysisExport {
    background-color: #fff;
    width: 1090px !important;
    /* height: 400px; */
    margin: auto;
    padding: 40px;
    box-sizing: border-box;
  }
  .textCenter {
    text-align: center;
  }
  .margin40 {
    margin: 40px;
  }
  .table_style td,
  th {
    padding: 10px;
    font-size: 15px;
    max-width: 300px;
  }
  .textCenter {
    text-align: center;
  }
  .table_style {
    border-collapse: collapse;
    width: 100%;
    text-align: center;
  }
  .collapseTitle {
    font-size: 15px;
    font-weight: 900;
  }
  h3 {
    font-size: 28px !important;
  }
}

.content {
  padding: 0px 50px 0 60px;
}

.explain {
  text-indent: 46px;
}

.echarts1 {
  // width: 350px;
  height: 490px;
  margin: 0 auto;
}

.preface {
  margin: 10px 0;
  text-indent: 46px;
  line-height: 35px;
}

.factor {
  // width: 300px;
  height: 490px;
  margin: 0 auto;
}
</style>
